<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:common="http://java.sun.com/jsf/composite/common">
<h:body>
	<ui:composition template="/pages/templates/MainTemplate.xhtml">
		<ui:define name="content">
			<div>
				<h3>Agregar Pedido</h3>
			</div>
			<h:form id="dialogForm" styleClass="tableNoGrid">
				<p:messages id="growl" globalOnly="true" showDetail="true"
					showSummary="true" />
				<common:CRUDMenuBar id="ordnProdMenuBar"
					crudManagedBean="#{ordenVtaMB}">
				</common:CRUDMenuBar>
				<div class="panel-group" id="accordion" style="margin-top: 10px;">
					<div class="panel panel-default">
						<div class="panel-heading">
							<h4 class="panel-title">
								<a class="accordion-toggle" data-toggle="collapse"
									data-parent="#accordion" href="#collapseOne"> Pedido </a>
							</h4>
						</div>
						<div id="collapseOne" class="panel-collapse collapse in">
							<div class="panel-body">
								<common:pedidoData pedido="#{ordenVtaMB.newOrden.pedidoVenta}"
									readOnly="#{ordenVtaMB.addingItemToSalesOrder}" id="pedidoData"
									container="pedidoPanel" parentId="dialogForm" />
							</div>
						</div>
					</div>
				</div>
				<div class="panel-group" id="accordion" style="margin-top: 10px;">
					<div class="panel panel-default">
						<div class="panel-heading">
							<div class="row">
								<div class="col-md-6">
									<h4 class="panel-title">
										<a class="accordion-toggle" data-toggle="collapse"
											data-parent="#accordion" href="#collapseArt"> Articulo </a>
									</h4>
								</div>
								<div class="col-md-6">
									<div class="dropdown pull-right">
										<a data-toggle="dropdown" href="#"><span
											class="glyphicon glyphicon-cog"></span></a>
										<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
											<li><p:commandLink process="@this" onclick="addNewItem.show()"
													value="Nuevo Art."></p:commandLink></li>
										</ul>
									</div>
								</div>
							</div>
						</div>

						<div id="collapseArt" class="panel-collapse collapse in">
							<div class="panel-body">
								<common:itemData tiposMaterial="#{ordenVtaMB.tiposMaterial}"
									tipoMaterialSeleccionado="#{ordenVtaMB.tipoMaterialSeleccionado}"
									muestraDialogListner="#{ordenVtaMB.getResultMuestra}"
									item="#{ordenVtaMB.newOrden.item}" readOnly="true"
									id="itemsData" container="itemsPanel" parentId="dialogForm" />
							</div>
						</div>
					</div>
				</div>
				<!-- CARACTERISTICAS -->
				<div class="panel-group" id="accordion" style="margin-top: 10px;">
					<div class="panel panel-default">
						<div class="panel-heading">
							<h4 class="panel-title">
								<a class="accordion-toggle" data-toggle="collapse"
									data-parent="#accordion" href="#collapseCaracteristicas">
									Caracteristicas </a>
							</h4>
						</div>
						<div id="collapseCaracteristicas"
							class="panel-collapse collapse in">
							<div class="panel-body">
								<p:panelGrid id="caracPanel">
									<p:row>
										<p:column>
											<h:outputLabel for="bolsasSobre" value="Bolsas/sobre" />
										</p:column>
										<p:column>
											<p:inputText id="bolsasSobre" maxlength="9"
												value="#{ordenVtaMB.newOrden.bolsasSobre}" required="true">
											</p:inputText>
										</p:column>
										<p:column>
											<p:message id="bolsasSobre_message" for="bolsasSobre"
												showDetail="false" />
										</p:column>
										<p:column>
											<h:outputLabel for="sobresBulto" value="Sobres/bulto" />
										</p:column>
										<p:column>
											<p:inputText id="sobresBulto"
												value="#{ordenVtaMB.newOrden.sobresBulto}" required="true" />
										</p:column>
										<p:column>
											<p:message showDetail="false" id="sobresBulto_message"
												for="sobresBulto" />
										</p:column>
									</p:row>
									<p:row>
										<p:column>
											<h:outputLabel for="cantidad" value="Cantidad" />
										</p:column>
										<p:column>
											<p:inputText id="cantidad" maxlength="10"
												value="#{ordenVtaMB.newOrden.cantidad}" required="true">
											</p:inputText>
										</p:column>
										<p:column>
											<p:message id="cantidad_message" for="cantidad"
												showDetail="false" />
										</p:column>
										<p:column>
											<h:outputLabel for="prioridad" value="Prioridad" />
										</p:column>
										<p:column>
											<p:spinner id="prioridad"
												value="#{ordenVtaMB.newOrden.prioridad}" min="0" max="5"
												required="true" />
										</p:column>
										<p:column>
											<p:message showDetail="false" id="prioridad_message"
												for="prioridad" />
										</p:column>
									</p:row>
									<p:row>
										<!-- FECHA DE ENTREGA -->
										<p:column>
											<h:outputLabel for="fechaEntrega" value="Fecha de entrega" />
										</p:column>
										<p:column>
											<h:inputText id="fechaEntregaRO"
												value="#{ordenVtaMB.newOrden.fechaEntrega}" rendered="false">
												<f:convertDateTime pattern="dd/MM/yyyy" />
											</h:inputText>
											<p:calendar value="#{ordenVtaMB.newOrden.fechaEntrega}"
												pattern="dd/MM/yyyy" mindate="#{ordenVtaMB.currentDate}"
												locale="es" id="fechaEntrega" showOn="button"
												rendered="true"></p:calendar>
										</p:column>
										<p:column>
											<p:message showDetail="false" id="fecha_message"
												for="fechaEntrega" rendered="true" />
										</p:column>
									</p:row>
								</p:panelGrid>
							</div>
						</div>
					</div>
				</div>

				<div class="row" style="margin-top: 10px;">
					<div class="col-md-12">
						<p:outputLabel value="Observaciones"></p:outputLabel>
						<p:inputTextarea id="observaciones"
							value="#{ordenVtaMB.newOrden.observacion}" rows="1" cols="250"
							counter="counter" maxlength="250"
							counterTemplate="{0} caracteres restantes."
							style="width: 100%; margin-top:10px;" />
						<h:outputText id="counter" style="margin-bottom:10px;" />
					</div>
				</div>
				<div class="row">
					<div class="col-md-12">
						<p:commandButton id="submitButton" value="Agregar"
							actionListener="#{ordenVtaMB.save}" styleClass="pull-right"
							update=":dialogForm:growl :dialogForm:itemsData:itemsPanel  :dialogForm:caracPanel :dialogForm:pedidoData:pedidoPanel">
						</p:commandButton>
					</div>
				</div>

				<p:dialog id="itemDialogID" widgetVar="itemDialog" modal="true"
					header="Pedido de venta" showEffect="clip" hideEffect="clip">
					<common:items
						updateElement=":dialogForm:itemsData:itemsPanel :dialogForm:growl"
						returnAction="#{ordenVtaMB.getResultItem}" id="items"
						oncomplete="itemDialog.hide();" />
				</p:dialog>
			</h:form>

			<p:dialog id="addItemDialog" widgetVar="addNewItem" modal="true"
				header="Articulo nuevo">
				<p:ajax event="close" update=":dialogForm:itemsData:itemsPanel"
					listener="#{ordenVtaMB.updateNewItem}"></p:ajax>
				<h:form id="addItemForm" styleClass="tableNoGrid">
					<p:messages id="addMessages" showDetail="true" globalOnly="true"></p:messages>
					<!--ITEM DATA  -->
					<common:itemData tiposMaterial="#{itemsMB.tiposMaterial}"
						muestraDialogListner="#{itemsMB.getResultMuestra}"
						tipoMaterialSeleccionado="#{itemsMB.tipoMaterialSeleccionado}"
						item="#{itemsMB.newItem}" readOnly="false" newCreatedItem="true"
						isModal="false" id="itemsData" container="itemsPanel"
						parentId="addItemForm" />

					<p:commandButton id="addItemButton"
						actionListener="#{itemsMB.addNewItem}" value="Agregar"
						icon="ui-icon-arrowthick-1-n"
						oncomplete="handleAddItemDialogClose(xhr, status, args);"
						update=":addItemForm:addMessages :addItemForm:itemsData:itemsPanel"
						style="margin-top: 10px;" />
				</h:form>
			</p:dialog>

		</ui:define>
	</ui:composition>
</h:body>
</html>
